<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>OA</title>
    <style>
        html, body {
            height: 100%;
        }

        div .help-block {
            display: none;
        }

        .no-validate {
            display: block !important;
        }

        .loading-masks {
            position: relative;
            width: 100%;
            height: 100%;
            background-color: #2b542c;
            z-index: 999;
            filter: alpha(opacity=45);
            opacity: 0.45;
        }

        .loading-inactive {
            display: none;
        }

        .loading {
            position: absolute;
            background-color: rgba(0, 0, 0, 1);
            background-image: url(/assets/img/loading.gif);
            background-repeat: no-repeat;
            background-position: 10px center;
            color: #fff;
            line-height: 80px;
            border-radius: 10px;
            text-align: center;
            z-index: 9999;
            top: 50%;
            left: 50%;
            margin: -40px 0 0 -100px;
            width: 200px;
            height: 80px;
            border: 1px solid #008800;
        }

        .page-body iframe {
            padding: 0;
            border: none;
            margin: 0;
            width: 100%;
            height: 100%;

        }

        .page-body iframe > html, .page-body iframe > html > body {
            background-color: transparent !important;
        }


    </style>

    <meta name="description" content="OA"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="shortcut icon" href="/assets/img/favicon.png" type="image/x-icon">
    <link href="/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/css/font-sans.min.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/css/beyond.min.css" rel="stylesheet" type="text/css"/>
    <style>
        .navbar-left > li > a {
            color: white;
        }

        .navbar-left > li > a:hover {
            color: #222;
        }

        .navbar-nav > li > a {
            padding-top: 12px;
            padding-bottom: 15px
        }

        /*.menu-select {*/
        /*background-color: #eee;*/
        /*}*/

        /*.menu-select > a {*/
        /*color: #222 !important;*/
        /*}*/
    </style>
    <script>
        var csss = ['/assets/css/page.css',
            '/assets/css/bootstrap-datetimepicker.css',
            '/assets/css/jquery.bootgrid.css',
            '/assets/css/route.css'
        ];
        for (m = 0; m < csss.length; m++) {
            document.write('<link href="' + csss[m] + '?license=' + new Date().getTime() + '" rel="stylesheet" />');
        }
    </script>
    <link href="/assets/css/typicons.min.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/css/animate.min.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/css/dataTables.bootstrap.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/js/ztree/css/metroStyle/metroStyle.css" rel="stylesheet" type="text/css"/>
    <style>
        .main-container {
            width: 100%;
            height: 100%;
            position: absolute;
            padding-top: 45px;
            top: 0;
            left: 0;
        }

        .navbar .navbar-inner .navbar-header .navbar-account .account-area {
            right: 10px;
        }
    </style>
    <script src="/assets/js/jquery.min.js" type="text/javascript"></script>
    <script src="/assets/js/jquery.cookie.js"></script>
    <script src="/assets/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="/assets/js/moment.js" type="text/javascript"></script>
    <script src="/assets/js/slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>

</head>
<body>

<div class="navbar">
    <div class="navbar-inner">
        <div class="navbar-container">
            <div class="navbar-header pull-left">
                <a class="navbar-brand">
                    <small>
                        <img src="assets/img/logo-inverted.png" alt=""/>
                    </small>
                </a>
            </div>
            <div class="sidebar-collapse" id="sidebar-collapse">
                <i class="collapse-icon fa fa-bars"></i>
            </div>
            <div class="navbar-header pull-left ">
                <ul id="menuTop" class="nav navbar-nav navbar-left" style="margin-left: 37px;">
                </ul>
            </div>
            <div class="navbar-header pull-right">
                <div class="navbar-account">
                    <ul class="account-area">
                        <li>
                            <a title="Chat" class="wave in" id="chat-link" href="#">
                                <i class="icon glyphicon glyphicon-comment"></i>
                            </a>
                        </li>
                        <li id="liprofile">
                            <a class="login-area dropdown-toggle" aria-expanded="true" data-toggle="dropdown"
                               style=" ;min-width: 190px;">
                                <div title="查看个人信息" class="avatar">
                                    <img src="assets/img/avatars/adam-jansen.jpg">
                                </div>
                                <section>
                                    <h2><span class="profile"><span></span></span></h2>
                                </section>
                            </a>
                            <!--Login Area Dropdown-->
                            <ul class="pull-right dropdown-menu dropdown-arrow dropdown-login-area">
                                <li class="username"><a></a></li>
                                <li class="email"><a></a></li>
                                <!--Avatar Area-->
                                <li>
                                    <div class="avatar-area">
                                        <img class="avatar" src="assets/img/avatars/adam-jansen.jpg">
                                        <span class="caption">选择照片</span>
                                    </div>
                                </li>
                                <!--Avatar Area-->
                                <li class="edit">
                                    <a class="pull-left" href="profile.html">个人信息</a>
                                    <a class="pull-right" href="#">设置</a>
                                </li>
                                <!--Theme Selector Area-->
                                <li class="theme-area">
                                    <ul class="colorpicker" id="skin-changer">
                                        <li><a class="colorpick-btn" style="background-color:#5DB2FF;"
                                               rel="/assets/css/skins/blue.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#2dc3e8;"
                                               rel="/assets/css/skins/azure.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#03B3B2;"
                                               rel="/assets/css/skins/teal.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#53a93f;"
                                               rel="/assets/css/skins/green.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#FF8F32;"
                                               rel="/assets/css/skins/orange.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#cc324b;"
                                               rel="/assets/css/skins/pink.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#AC193D;"
                                               rel="/assets/css/skins/darkred.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#8C0095;"
                                               rel="/assets/css/skins/purple.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#0072C6;"
                                               rel="/assets/css/skins/darkblue.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#585858;"
                                               rel="/assets/css/skins/gray.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#474544;"
                                               rel="/assets/css/skins/black.min.css"></a></li>
                                        <li><a class="colorpick-btn" style="background-color:#001940;"
                                               rel="/assets/css/skins/deepblue.min.css"></a></li>
                                    </ul>
                                </li>
                                <!--/Theme Selector Area-->
                                <li class="dropdown-footer">
                                    <a href="#" onclick="logout()">
                                        <i class="icon fa fa-power-off"></i>退出
                                    </a>
                                </li>
                            </ul>
                            <!--/Login Area Dropdown-->
                        </li>

                    </ul>
                    <div class="setting-container">
                        <label>
                            <a onclick="logout()">
                                退出
                            </a>
                        </label>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="main-container container-fluid" style="height: 100%">
    <div class="page-container" style="height: 100%">
        <div class="page-sidebar" id="sidebar">
            <div class="sidebar-header-wrapper">
                <input type="text" class="searchinput"/>
                <i class="searchicon fa fa-search"></i>
                <div class="searchhelper" data-culture="search">搜索</div>
            </div>
            <ul class="nav sidebar-menu"></ul>
        </div>
        <div class="page-content" style="position: relative;height: 100%">
            <div class="loading-masks loading-inactive">
                <div id="loading" class="loading">正在处理数据...</div>

            </div>
            <div class="page-breadcrumbs" style="position: absolute; top: 0;left: 0;width: 100%;height: 40px;">
                <ul class="breadcrumb">
                    <li>
                        <i class="fa fa-home"></i>
                        <a id="home" data-culture="home">主页</a>
                    </li>
                    <li class="active"></li>
                </ul>

                <a style="float: right; margin-right: 5px;" id="refresh">
                    <i class="glyphicon glyphicon-refresh"></i>
                </a>
            </div>
            <div style="width: 100%; position: absolute; box-sizing:border-box;
            height: 100%;top:0; padding-top: 40px;">
                <div class="page-body no-padding-left no-padding-right"
                     style=" width: 100%; height: 100%;overflow-y: auto; box-sizing:border-box;">
                    <div id="pageBody" style="width: 100%;height: 100%;"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade bs-example-modal-sm" id="passwdmodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <form id="passwdEditForm" method="post" class="form-horizontal" role="form">
            <div class="modal-content">
                <div class="widget no-padding">
                    <div class="widget-header bg-themeprimary">
                        <i class="widget-icon fa fa-user"></i>
                        <span class="widget-caption">密码修改</span>
                        <div class="widget-buttons">
                            <a tabindex="7" data-type="reset"><i class="fa fa-refresh"></i></a>
                            <a data-dismiss="modal">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="widget-body">
                        <table class="table table-bordered form">
                            <thead>
                            <tr>
                                <th style="width:120px;"></th>
                                <td style="width: auto;"></td>

                            </tr>
                            </thead>
                            <tbody>

                            <tr>
                                <th><label for="loginName"></label><input name="id" id="id" type="hidden"/>
                                </th>
                                <td><input class="form-control" name="loginName" id="loginName" type="text"
                                           placeholder="用户帐号"/></td>

                            </tr>
                            <tr>
                                <th><label for="password"></label>
                                </th>
                                <td><input class="form-control" name="password" id="password" type="text"
                                /></td>
                            </tr>
                            <tr>
                                <th><label for="newpassword"></label></th>
                                <td><input type="password" class="form-control" name="newpassword" id="newpassword">
                                </td>
                            </tr>
                            <tr>
                                <th><label for="confirmPassword"></label></th>
                                <td><input type="password" class="form-control" name="confirmPassword"
                                           id="confirmPassword">
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button data-culture="save" type="submit" id="btnSave" class="btn btn-success"
                            data-loading-text="保存中...">
                        <i class="glyphicon glyphicon-floppy-disk"></i>保存
                    </button>
                    <button data-culture="close" type="button" class="btn btn-danger" data-dismiss="modal">
                        <i class="glyphicon glyphicon-remove"></i>关闭
                    </button>
                </div>
            </div>

        </form>
    </div>
</div>
<script src="/assets/js/beyond.js" type="text/javascript"></script>
<script src="/assets/js/treepicker/jquery.treepicker.js"></script>
<script src="/assets/js/skins.min.js"></script>
<script type="text/javascript">
    var jss = ['/assets/js/webapp.js',
        '/assets/js/jquery-1.10.2.plugin.js',
        '/assets/js/culture.js',
        '/assets/js/validation/jquery.bootvalidate.js',
        '/assets/js/bootgrid/jquery.bootgrid.js',
        '/assets/js/ztree/jquery.ztree.all-3.5.js',
        '/assets/js/bootbox/bootbox.js',
        '/assets/js/treepicker/jquery.treepicker.js',
        '/assets/js/selectpicker/jquery.selectpicker.js',
        '/assets/js/datetime/bootstrap-datepicker.js',
        '/assets/js/workflow/wf.designer.js'
//        '/assets/js/workflow/common.js',
//        '/assets/js/workflow/define.js',
//        '/assets/js/workflow/service.js',
//        '/assets/js/workflow/class.js',
//        '/assets/js/workflow/workflow.js'
    ];
    for (n = 0; n < jss.length; n++) {
        document.write('<script src="' + jss[n] + '?license=' + new Date().getTime() + '"><' + "/" + 'script>');
    }
</script>

<script type="text/javascript">

    $(function () {
        Array.prototype.singal = function (value, proto) {
            if (proto)
                for (i in this) {
                    if (this[i][proto] == value)
                        return this[i];
                }
            else {
                for (i in this) {
                    if (this[i] == value)
                        return this[i];
                }
            }
            return null;

        };
        Array.prototype.remove = function (value, proto) {
            for (i in this) {
                if (this[i][proto] === value) {
                    this.splice(i, 1);
                    return;
                }
            }

        };
        Array.prototype.removeat = function (index) {
            this.splice(index, 1);
        };
        Array.prototype.where = function (value, proto) {
            var menus = [];
            if (proto)
                for (i in this) {
                    if (this[i][proto] == value && !(typeof (this[i]) == "function"))
                        menus.push(this[i]);
                }
            else {
                for (i in this) {
                    if (this[i] === value && !typeof (this[i]) == "function")
                        menus.push(this[i]);
                }
            }
            return menus;
        };

    })


    var pageParm = {};
    var bootbox = new bootbox();
    var cculture = "zh-CN";
    var isCN = culture.getCulture() == "zh-CN";
    if (culture) {
        cculture = culture.getCulture();
    }
    var pagebody;
    var modals;
    var passwordvalidateParam = {
        submitHandler: function (obj) {
            alert(obj)
            $.request('/admin/sys/passwd/auth', obj, function (result) {
                try {
                    $('#passwdmodal').modal('hide');
                }
                catch (ex) {
                }
            }).always(function () {
                passwordvalidateParam.resetBtn.trigger("reset");
            });
        },
        fields: {
            loginName: {
                validators: {
                    notEmpty: {}
                }
            },
            password: {
                validators: {
                    notEmpty: {}
                }
            },
            newpassword: {
                validators: {
                    notEmpty: {}
                }
            },
            confirmPassword: {
                validators: {
                    notEmpty: {}
                }
            }

        }
    };
    $(function () {
        var menuTop = $("#menuTop");
        $("#btnPassword").unbind('click').click(function () {
            $('#passwdmodal').modal('show');
            $('#loginName').val(context.name);
        });
        $('#passwdEditForm').validate(passwordvalidateParam);
        $('title').html(app.name)
        $("#home").attr("href", "/index.html?license=" + new Date().getTime());
        pagebody = $("#pageBody");
//        loadpage('/views/work/home.html');
//         loadpage('/views/work/socket.html');
        pageParm.template={
            id:127,
        }
       loadpage('/views/work/home.html');
        var sideBar = $(".sidebar-menu");
        $.request("/admin/sys/user/menu", {token: context.token},
            function (result) {
                if (result) {
                    var top = result.where(app.menuprentId, 'parentId').where('1', 'functionType');
                    $.each(top, function (j, menutop) {
                        var text = cculture == "zh-CN" ? menutop.name : menutop.enName;
                        var li = $("<li>");
                        var a = $("<a>");
                        menuTop.append(li.append(a.html(text)));
                        var sub = result.where(menutop.id, 'parentId').where('1', 'functionType');
                        li.on("select", function () {
                            li.addClass("menu-select");

                        }).on("unselect", function () {
                            li.removeClass("menu-select");
                        }).on("click", function () {
                            sideBar.html("");
                            $.each(sub, function (i, val) {
                                generateLi(result, val, sideBar);
                            });
                            menuTop.find("li").trigger("unselect");
                            li.trigger("select");
                        });
                        //generateLi(result, menutop, sideBar);
                    })
                    menuTop.find("li")[0].click();
                } else {
                    window.location.href = '/login.html';
                }
            });
        $('#dashboard-bandwidth-chart').data('width', $('.box-tabbs').width() - 20);
        var login = $("#liprofile");
        $(".login-area section span span", login).html(context.name);
        $(".username a", login).html(context.name);
        $(".email a", login).html(context.email ? context.email : '');
    });
    function generateA(menu, li, parent) {
        var a = $("<a >");
        if (menu.href) {
            a.click(function () {
                try {
                    $("li", parent).removeClass('active');
                    li.addClass('active');
                    try {
                        if (dispose != undefined) {
                            dispose();
                        }
                    } catch (e) {
                    }

//                    if (modals)
//                        modals.remove();
                    loadpage(menu.href, menu.loadType);
                }
                catch (ex) {
                    alert(ex);
                }
            })
        }
        //增加图标
        if (menu.icon && menu.icon != " ") {
            var i = $("<i class='menu-icon glyphicon'>").addClass(menu.icon).css('height', '14px').css("color", menu.iconColor);
            a.append(i);
        }
        //增加文字描述
        var span = $("<span>").html(cculture == "zh-CN" ? menu.name : menu.enName).addClass('menu-text');
        a.append(span);
        return a;
    }
    function generateLi(result, menu, parent) {
        var li = $("<li>");
        parent.append(li);
        var sub = result.where(menu.id, 'parentId').where('1', 'functionType');
        var a = generateA(menu, li, parent);
        li.append(a);
        if (sub && sub.length > 0) {
            a.addClass('menu-dropdown');
            var i = $("<i>").addClass('menu-expand');
            a.append(i);
            var ul = $("<ul>").addClass('submenu');
            li.append(ul);
            $.each(sub, function (k, submenu) {
                generateLi(result, submenu, ul);
            })
        }
    }
    function logout() {
        $.request('/admin/sys/user/logout', {
            token: context.token
        }, function (result) {
            $.removeCookie(app.name + '_token')
            window.location.href = '/login.html?license=' + new Date().getTime();
        });
    }
    function Refresh() {
        var me = this;
        me.url = "";
        Refresh.prototype.setUrl = function (url) {
            me.url = url;
        }
        $("#refresh").click(function () {
            if (me.url)
                loadpage(me.url);
        });

    }
    var refresh = new Refresh();
    function loadpage(url, isiframe) {

        var para = {};
        pagebody.html('');
        if (url.indexOf('?') > -1) {
            para = getQueryParams(url.split('?')[1]);
            url += '&license=' + new Date().getTime();
        } else {
            url += '?license=' + new Date().getTime();
        }
        refresh.setUrl(url);
        console.log(url);
        if (modals)
            modals.remove();
        if (isiframe) {
            var iframe = $("<iframe>").attr('src', url + '?license=' + new Date().getTime());
            pagebody.append(iframe);
        }
        else
            pagebody.load(url, null, function () {
                culture.translate($("body"));
                modals = $(".page-body").find('.modal');
                $("body").append(modals);
                $(".page-breadcrumbs").find('li[class="active"]').html($("title", pagebody).html());
                try {
                    init(para);
                }
                catch (e) {
                    bootbox.alert(e.message);
                }
            });

    }


    function getQueryParams(qs) {
        qs = qs.split('+').join(' ');

        var params = {},
            tokens,
            re = /[?&]?([^=]+)=([^&]*)/g;

        while (tokens = re.exec(qs)) {
            params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
        }

        return params;
    }
    //    $(function () {
    //        $(".page-content").css('height', $('body').height() - $(".navbar").height());
    //        $(".page-body").css('height', $('.page-content').height() - $(".navbar").height() - 40);
    //    });
    $(window).resize(function () {
        $(".page-content").css('height', $('body').height() - $(".navbar").height());
        $(".page-body").css('height', $('.page-content').height() - $(".navbar").height());
    })
</script>
</body>
</html>
